<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form action="">
        <table>
            <tr>
                <th></th>
                <th>xxxx</th>
                <th >性别</th>
                <th>xxxx</th>
                <th>xxxx</th>
            </tr>
            <tr>
                <td> <input type="checkbox"> </td>
                <td>xxxx</td>
                <td>女</td>
                <td>xxxx</td>
                <td>xxxx</td>
            </tr>
            <tr>
                <td> <input type="checkbox"> </td>
                <td>xxxx</td>
                <td>女</td>
                <td>xxxx</td>
                <td>xxxx</td>
            </tr>
            <tr>
                <td> <input type="checkbox"> </td>
                <td>xxxx</td>
                <td>男</td>
                <td>xxxx</td>
                <td>xxxx</td>
            </tr>
            <tr>
                <td> <input type="checkbox"> </td>
                <td>xxxx</td>
                <td>男</td>
                <td>xxxx</td>
                <td>xxxx</td>
            </tr>
        </table>
        <input type="checkbox" id="alls" onclick="allss()"><button>全选</button><br>
        <input type="checkbox" id="nan" onclick="man()"><button>只选男</button><br>
        <input type="checkbox" id="women" onclick="womens()"><button>只选女</button><br>
    </form>

    <script type="text/javascript">
    function allss(){
        var table= document.getElementsByTagName('table')[0];
        var input=table.getElementsByTagName('input');
        var all=document.getElementById('alls');
        var arr=[].slice.call(input);
        arr.forEach(element => {
            element.checked=all.checked;
        });
    }
    var nan=document.getElementById('nan');
    function man(){
        var table= document.getElementsByTagName('table')[0];
        var tr=table.getElementsByTagName('tr');
      
        for(var i=1;i<tr.length;i++){
            var td=tr[i].getElementsByTagName('td')[2];
            if(td.innerText=='男'){
                tr[i].getElementsByTagName('td')[0].getElementsByTagName('input')[0].checked=nan.checked;
            }
        }
    }
    var women=document.getElementById('women');
    function womens(){
        var table= document.getElementsByTagName('table')[0];
        var tr=table.getElementsByTagName('tr');
     
        for(var i=1;i<tr.length;i++){
            var td=tr[i].getElementsByTagName('td')[2];
            if(td.innerText=='女'){
                console.log(111);
                tr[i].getElementsByTagName('td')[0].getElementsByTagName('input')[0].checked=women.checked;
            }
        }
    }
    </script>
</body>
</html>